<!DOCTYPE html>
<html>
<head>
<include file="Public:meta"/>
</head>
<body>

<div class="easyui-panel" title="生成二维码">
	<div style=" width:320px; height:150px; margin: 0 auto; margin-top:20px;">
    	<table>
        	<tr>
            	<td width="50%">
                	<img src="" width="150" height="150" title="带logo二维码【生成后点右键保存】" alt="带logo二维码【生成后点右键保存】" id="code_logo"/>
                </td>
                <td width="50%" align="right">
                	<img src="" width="150" height="150" title="不带logo二维码【生成后点右键保存】" alt="不带logo二维码【生成后点右键保存】" id="code_nologo"/>
                </td>
            </tr>
        </table>
    </div>
	<form id="edit-form" method="post">
	<table class="form-table" style="margin-top:30px;">
    	<tr>
        	<td style="width: 30%; border-color: #ccc; background:#dcdcdc; border-width: 1px 0 1px 0;" align="right">二维码链接</td>
            <td style="width: 70%; border-color: #ccc; border-width: 1px 0 1px 0;">
           <input class="easyui-textbox"  name="url" id="url" value="{$url}" required style="width: 60%;">
            </td>
        </tr>
    	<tr>
        	<td style="width: 30%; border-color: #ccc; background:#dcdcdc;" align="right">二维码尺寸</td>
            <td style="width: 70%; border-color: #ccc;">
            <input class="easyui-slider"  name="size" id="size" value="4"  style="width: 60%;"
            data-options="showTip:true,min:1,max:100">
            </td>
        </tr>
       <tr>
        	<td style="width: 30%; border-color: #ccc; background:#dcdcdc;" align="right">是否带LOGO</td>
            <td style="width: 70%; border-color: #ccc;">
			<input type="radio" name="set_logo" value="1" style="display:inline;" checked>中间放置LOGO
            <input type="radio" name="set_logo" value="0" style="display:inline;">不放置LOGO
            </td>
        </tr>
        <tr>
        	<td style="width: 30%; border-color: #ccc;" align="right"></td>
            <td style="width: 70%; border-color: #ccc;">
            <a href="javascript:void(0);" onClick="$('#edit-form').submit();" class="easyui-linkbutton" iconCls="icon-save">生成二维码[生成后鼠标点击右键保存到本地]</a>
            </td>
        </tr>
    </table>
	</form>
</div>
    
<script type="text/javascript">

	$(function(){
		var saveUrl = "{:U('QRCode/makeQRCodeForUrl')}?act=make";
		$('#edit-form').form({
			url:saveUrl,
			onSubmit: function(){
				//进行表单验证
				//如果返回false阻止提交
				return $(this).form('validate');
			},
			success:function(data){
				var json = $.parseJSON(data);
				if(json.status == 1){
					var path = "{$_RPath}upload/qrcode/";
					$("#code_nologo").attr('src',path+json.qr_code);
					if(typeof(json.qr_code_logo) != "undefined"){
						$("#code_logo").attr('src',path+json.qr_code_logo);
					}else{
						$("#code_logo").attr('src','');
					}
				}else{
					$.messager.alert('操作提示','生成二维码失败！','error');
				}
			}
		});

		$(".form-table td").hover(function(){
			$(this).css("borderColor","#f60");
			var index = $(this).index();
			if(index % 2 == 0){
				$(this).next().css("borderColor","#f60");
			}else{
				$(this).prev().css("borderColor","#f60");
			}
		},function(){
			$(this).css("borderColor","#ccc");
			var index = $(this).index();
			if(index % 2 == 0){
				$(this).next().css("borderColor","#ccc");
			}else{
				$(this).prev().css("borderColor","#ccc");
			}
		});

	});
</script>


</body>
</html>